<template>
    <div>
        <div class="row" v-for="row in gameRow" :key="row">
            <div v-for="col in gameCol" :key="col">
                <Box :type="map[row - 1][col - 1]"></Box>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import Box from './Box.vue';
import { gameRow, gameCol } from '../game';
import { map } from '../game/map';
</script>

<style scoped>
.row {
    display: flex;
}
</style>
